<ion-header class="ion-no-border">
  <ion-toolbar>
    <ion-grid class="ion-no-padding">
      <ion-row style="width: fit-content;">
        <ion-col *ngIf="!slideFlag">
          <ion-row>
            <div (click)="myCreate()" style="font-size: smaller;padding: 12px 12px 0 12px;">
              <ion-text *ngIf="slideFlag">我创建的</ion-text>
              <ion-text *ngIf="!slideFlag" color="secondary">我创建的</ion-text>
            </div>
          </ion-row>
          <ion-row>
            <hr *ngIf="!slideFlag" class="line">
          </ion-row>
        </ion-col>
        <ion-col *ngIf="slideFlag">
          <ion-row>
            <div (click)="myJoin()" style="font-size: smaller;padding: 12px 12px 0 12px;">
              <ion-text *ngIf="!slideFlag">我加入的</ion-text>
              <ion-text *ngIf="slideFlag" color="secondary">我加入的</ion-text>
            </div>
          </ion-row>
          <ion-row>
            <hr *ngIf="slideFlag" class="line">
          </ion-row>
        </ion-col>
      </ion-row>
    </ion-grid>
    <ion-button fill="clear" (click)="more($event)" slot="end"><ion-icon name="add-outline"></ion-icon></ion-button>
  </ion-toolbar>
</ion-header>

<ion-content>
  <div *ngIf="classList.length == 0" style="text-align: center;">
    <h2 *ngIf="slideFlag">您还没有加入的班课</h2>
    <h2 *ngIf="!slideFlag">您还没有创建的班课</h2>
  </div>
  <ion-list>
    <ion-item detail *ngFor="let item of classList" (click)="detailInfo(item.courseCode)">
      <ion-thumbnail slot="start">
        <ion-img src="/assets/img/course_photo.jpg"></ion-img>
      </ion-thumbnail>
      <ion-label>
        <h2>{{item.courseName}}</h2>
        <h3>{{item.teacherName}}</h3>
        <p>{{item.semester}}</p>
      </ion-label>
    </ion-item>
  </ion-list>
</ion-content>
